<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
	/*
		类选择器
	*/
	.female{
		color:pink;
	}
	/*
		ID选择器:选择id=某值的唯一元素
		
	*/
	#p4{
		color:red;
	}
	/*
		选择器组:写出一组选择器,逗号隔开
		可以选中每个选择器所对应的目标的并集
	*/
	.female,#p4{
		font-weight:bold;
	}
	/*
		派生选择器
		后代选择器:选择某元素的子孙
		子元素选择器:选择某元素的儿子
	*/
	#p5 b{
		color:red;
	}
	#p5>b{
		font-size:30px;
	}
	/*
		伪劣选择器:是根据元素状态选择元素
		1)选择访问过/未访问过的超链接
		
	*/
	a:link{
		color:green;
	}
	a:visited{
		color:red;
	}
	/*
		2)选择激活态(正在点)的按钮
		
	*/
	#btn1:ACTIVE{
		background-color:yellow;
	}
	/*
		选择有焦点的框
	*/
	#t1:focus{
		background-color:green;
	}
	/*
		选择悬停态的图片(鼠标位于正上方的状态)
	*/
	img:hover{
		width:250px; 
		height: 250px;
	}
</style>
</head>
<body>
	<p class="female">苍老师呀苍老师</p>
	<p>范传奇呀范传奇</p>
	<p class="female">王克晶啊王克晶</p>
	<p id="p4">瞧你们那点破事</p>
	<p id="p5">
	北京市<u>海淀区<b>北三环</b>路西</u>甲18号<b>中鼎大厦</b>B座8层
	</p>
	<p>
		<a href="http://www.tmooc.cn/">达内</a>
		<a href="http://www.taobao.com/">淘宝</a>
		<a href="http://www.baoidu.com/">百度</a>
		<a href="http://doc.tedu.cn/">文档_DOC</a>
		<a href="http://www.teddu.cn/">文档</a>
	</p>
	<p>
		<input type="button" value="点我" id="btn1"/>
	</p>
	<p>
		<input type="text" id="t1"/>
	</p>
	
	<p>
		<img alt="" src="../images/01.jpg">
	</p>
</body>
</html>
























